<script setup>
import { RouterLink, RouterView, useRouter } from 'vue-router'
import { ref } from "vue"
const info = ref('')
const router = useRouter()
const checkList = () => {
  router.push({
    path: '/selectList',
    query: {
      info: info.value
    }
  })
  console.log(1)
}
</script>

<template>
  <div class="wrapper">
    <h3>小说网</h3>
    <nav>
      <RouterLink to="/">玄幻</RouterLink>
      <RouterLink to="/lishi">历史</RouterLink>
    </nav>
    <input type="text" placeholder="请输入作者名字" v-model="info"><button @click="checkList">点击收索</button>
  </div>
  <router-view></router-view>
</template>
<style scoped>
.wrapper {
  max-width: 1240px;
  text-align: center;
  margin: 0 auto;
}

.wrapper nav {
  width: 100%;
  display: flex;
  justify-content: center;
}

.wrapper nav a {
  display: block;
  flex: 0 0 10%;
  height: 40px;
  line-height: 40px;
}

.wrapper nav a:hover {
  color: red;
}
</style>
